<template>
    <div>
        <ul>
            <li v-for="item in messageArr" :key="item.id">
                <!-- 点击传递params参数 -->
                <!-- <router-link :to="`/home/message/detail/${item.id}/${item.title}/${item.content}`">{{item.title}}</router-link>&nbsp;&nbsp; -->
                
                
                <!-- 点击传递params参数 -->
                <!-- <router-link :to="`/home/message/detail?id=${item.id}&title=${item.title}&content=${item.content}`">{{item.title}}</router-link>&nbsp;&nbsp; -->
                
                
                <!-- 点击传递params参数 -->
                <router-link :to="{name:'xiangqing',params:{id:item.id},query:{title:item.title,content:item.content}}">{{item.title}}</router-link>&nbsp;&nbsp;
            </li>
        </ul>
        <hr>
        <router-view></router-view>
    </div>
</template>

<script>
export default {
    name:"Message",
    data() {
        return {
            messageArr:[
                {id:'001',title:'info001',content:'爱抽烟'},
                {id:'002',title:'info002',content:'爱喝酒'},
                {id:'003',title:'info003',content:'爱烫头'},
            ]
        }
    },
}
</script>

<style>

</style>